<%--
  Created by IntelliJ IDEA.
  User: xh
  Date: 2020/2/9
  Time: 14:51
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>bash运行脚本的几种方式 - 技术栈 -Java程序员成长平台</title>
    <meta name="keywords" content="">
    <meta name="description" content>
    <link rel="stylesheet" href="${APP_PATH}/vendor/layui-v2.4.5/layui/css/layui.css">
    <link rel="stylesheet" href="${APP_PATH}/css/common.css">
    <link rel="stylesheet" href="${APP_PATH}/css/header.css">
    <link rel="stylesheet" href="${APP_PATH}/css/footer.css">
    <link rel="stylesheet" href="${APP_PATH}/css/question-detail.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<jsp:include page="head.jsp"></jsp:include>

<div class="layui-main g-main">
    <div class="layui-row layui-col-space30">
        <div class="layui-col-xs9">
            <div class="layui-row ">
                <div class="layui-col-xs12 l-question-content">
                    <div class="layui-tab-item layui-show l-question-location-header">
                        <div class="layui-row">
                                   <span class="layui-breadcrumb">
                                      <a href="${APP_PATH}/question/toQuestion">求助问答</a>
                                      <a href="${APP_PATH}/user/toUser-home-for-other?id=${requestScope.question.userId}">${requestScope.question.questionInfo.user.username}</a>
                                      <a><cite>正文</cite></a>
                                    </span>
                        </div>
                        <div class="layui-row title">
                            <span class="layui-badge layui-bg-cyan c-mr3">顶</span>${requestScope.question.title}
                        </div>
                        <div class="layui-row author">
                            <div class="item">
                                <input type="hidden" value="${requestScope.question.id}" id="questionId">
                                <a href="${APP_PATH}/user/toUser-home-for-other?id=${requestScope.question.userId}" class="">
                                    <div class="user-img" title="${requestScope.question.questionInfo.user.username}">
                                        <img src="https://oscimg.oschina.net/oscnet/up-2bc558d24f672ece9b22f407fa83b0f1.jpeg!/both/50x50?t=1506965633000" alt="吴伟祥" title="吴伟祥">
                                    </div>
                                    &nbsp;<span>${requestScope.question.questionInfo.user.username}</span>
                                </a>
                                <span class="s-color-noclick">${requestScope.question.sendTime}</span>
                            </div>
                            <div class="item">
                                <span><i class="layui-icon layui-icon-star s-color-noclick">&nbsp;10藏</i></span>
                            </div>
                            <div class="item">
                                <span><i class="layui-icon layui-icon-reply-fill s-color-noclick">&nbsp;${requestScope.commentSize}答</i></span>
                            </div>
                            <div class="item">
                                        <span>
                                            <span><i class="layui-icon layui-icon-read">&nbsp;10阅</i></span>
                                        </span>
                            </div>
                            <div class="item report" data-id="1">
                                <a href="javascript:;">
                                    <i class="layui-icon layui-icon-tips c-mr3">&nbsp;举报</i>
                                </a>
                            </div>
                        </div>
                        <div class="layui-row tag">
                            <span class="layui-badge layui-bg-gray c-mr3">Publish</span>
                            <span class="layui-badge layui-bg-gray c-mr3">Base</span>
                            <span class="layui-badge layui-bg-gray c-mr3">Java</span>
                        </div>
                        <div class="layui-row content">
                            <div class="content-article">
                                ${requestScope.question.main}
                            </div>
                        </div>
                        <div class="layui-row operation">
                            <c:if test="${requestScope.collection==0}">
                                <a href="javascript:void(0);" onclick="collect()" class="layui-btn layui-btn-primary layui-btn-lg"><i class="layui-icon layui-icon-star"></i> 收藏 (<font id="collectionTotal">${requestScope.collectionTotal}</font>)</a>
                            </c:if>
                            <c:if test="${requestScope.collection!=0}">
                                <a href="javascript:void(0);" onclick="collect()" class="layui-btn layui-btn-primary layui-btn-lg"><i class="layui-icon layui-icon-star"></i> 已收藏 (<font >${requestScope.collectionTotal}</font>)</a>
                            </c:if>

                        </div>
                    </div>
                </div>
            </div>
            <hr>

            <div class="l-question-comment">
                <blockquote class="layui-elem-quote layui-quote-nm"><b>共${requestScope.commentSize}条答案</b></blockquote>
                <div>
                    <div id="j-temp-replay" class="layui-show">
                    <c:forEach items="${requestScope.comments}" var="comment">
                        <div class="layui-row item" >
                            <div class="layui-col-xs1 item-img">
                                <img  src="${APP_PATH}/img/2.png" class="layui-circle" width="100%">
                                <i class="layui-icon layui-icon-ok"></i>
                            </div>
                            <div class="layui-col-xs11 item-com">
                                <div class="item-head ">
                                    <a href="${APP_PATH}/user/toUser-home-for-other?id=${comment.userId}">${comment.commentInfo.user.username}&nbsp;
                                        <c:if test="${comment.userId==requestScope.question.userId}">
                                            <span class="layui-badge layui-bg-gray">作者</span>
                                        </c:if>
                                    </a>
                                    <span></span>
                                    <span>${comment.sendTime}</span>
                                    <i class="layui-icon layui-icon-tips"></i>
                                    <i class="layui-icon layui-icon-delete"></i>
                                </div>
                                <div class="item-content">
                                        ${comment.main}
                                </div>
                                <div class="item-comment">
                                    <div class="j-comment">
                                    </div>
                                </div>
                                <div class="item-reply">
                                    <div class="layui-col-space20 layui-row item-form">
                                        <div class="layui-col-xs10"><textarea type="text" placeholder="文明社会，理性答案"></textarea></div>
                                        <div class="layui-col-xs1"><button class="layui-btn layui-btn-primary">添加回复</button></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                </c:forEach>
                    </div>
                    <div class="j-user" data-user-head="img/photo.jpg" data-user-name="Destiny" data-user-id="_124680oic"></div>
                </div>
            </div>

            <div class="layui-row l-question-comment-input">
                <div class="title">发表答案</div>
                <form id="commentForm" method="post">
                <div class="input-content">
                    <input name="userId" id="userId" type="hidden" value="${sessionScope.user.id}">
                    <input name="forwardId" id="forwardId" type="hidden" value="${requestScope.question.id}">
                    <textarea name="main" id="commentMain" placeholder="文明社会，理性答案" class="layui-textarea j-reply-textarea"></textarea>
                </div>
                </form>
                <div class="operation">
                    <button class="layui-btn" onclick="comment();">立即发表</button>
                </div>
            </div>
        </div>
       <jsp:include page="right/right.jsp"></jsp:include>
    </div>
</div>

<div class="g-footer">
    <hr>
    <div>Copyright ©2018 技术栈(jishuzhan.club), All Rights Reserved.</div>
    <div>渝ICP备13001123号-2</div>
</div>

<script src="${APP_PATH}/vendor/holder.min.js"></script>
<script src="${APP_PATH}/vendor/layui-v2.4.5/layui/layui.js"></script>
<script src="${APP_PATH}/js/common.js"></script>
<script src="${APP_PATH}/js/question-detail.js"></script>
<script src="${APP_PATH}/js/report.js"></script>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script>
    function comment() {
        var userId=$("#userId").val();
        var forwardId=$("#forwardId").val();
        var main=$("#commentMain").val();

        if (main==''){
            layer.msg("答案内容不能为空", {time: 3000, icon: 5, shift: 6}, null);
            return;
        }

        var loadingIndex = null;
        $.ajax({
            url : "${APP_PATH}/comment/doAjaxComment2",
            method : 'POST',
            data : {
                userId : userId,
                forwardId:forwardId,
                main:main
            },success : function ( result ){
                if( result.success ){
                    var comment = result.data;
                    var commentContent = "";

                    commentContent += '<div  class="layui-row item">';
                    commentContent += '<div class="layui-col-xs1 item-img">';
                    commentContent += '<img src="${APP_PATH}/img/2.png" width="100%">';
                    commentContent += '</div>';
                    commentContent += '<div class="layui-col-xs11 item-com">';
                    commentContent += ' <div class="item-head">';
                    commentContent += ' <a href="${APP_PATH}/user/toUser-home-for-other?id='+comment.id+'">'+comment.commentInfo.user.username+'&nbsp;';
                    commentContent += ' </a>';
                    commentContent += ' <span></span>';
                    commentContent += '<span class="label time">'+comment.sendTime+'</span>';
                    commentContent += '<i class="layui-icon layui-icon-tips"></i>';
                    commentContent += ' <i class="layui-icon layui-icon-delete"></i>';
                    commentContent += ' </div>';
                    commentContent += ' <div class="item-content">';
                    commentContent += '  '+comment.main+'';
                    commentContent += '  </div>';
                    commentContent += '  <div class="item-btn">';
                    commentContent += '  <span class="j-reply">回复</span>';
                    commentContent += '   </div>';
                    commentContent += '  <div class="item-comment">';
                    commentContent += '  <div class="j-comment">';
                    commentContent += '    </div>';
                    commentContent += '  </div>';
                    commentContent += '  <div class="item-reply">';
                    commentContent += '  <div class="layui-col-space20 layui-row item-form">';
                    commentContent += ' <div class="layui-col-xs10"><textarea type="text" placeholder="文明社会，理性答案"></textarea></div>';
                    commentContent += ' <div class="layui-col-xs1"><button class="layui-btn layui-btn-primary">添加答案</button></div>';
                    commentContent += ' </div>';
                    commentContent += '  </div>';
                    commentContent += '  </div>';
                    commentContent += '  </div>';

                    $("#j-temp-replay").html(commentContent);

                    layer.msg("成功！", {time: 2000, icon: 6, shift: 4}, null);
                } else {
                    layer.msg("失败！", {time: 3000, icon: 5, shift: 6}, null);
                }
            }, complete : function(){
                layer.close(loadingIndex);
            }

        });
    }

    function collect() {
        var questionId=$("#questionId").val();
        var userId=$("#userId").val();
        var collectionTotal=$("#collectionTotal");
        layer.confirm("你确定要收藏吗？", {icon: 3, title: '提示'}, function (cindex) {

            // 将ids传入后台进行批量删除
            var loadingIndex = null;
            $.ajax({
                url: "${APP_PATH}/question/collect",
                method: "POST",
                data: {
                    questionId:questionId,
                    userId:userId
                },
                success: function (result) {
                    if (result.success) {
                        collectionTotal.html(parseInt(collectionTotal.html())+1);
                        layer.msg("收藏成功！", {time: 3000, icon: 6, shift: 2}, function () {
                            // 重新查询数据
                        });
                    } else {
                        layer.msg("收藏失败！", {time: 3000, icon: 5, shift: 6}, null);
                    }
                },
                complete: function () {
                    layer.close(loadingIndex);
                }
            });

            layer.close(cindex);
        }, function (cindex) {
            layer.close(cindex);
        });
    }
</script>
</body>
</html>
